<template>
  <van-dialog
    v-model="show.open"
    title="批准 / 驳回 原因"
    show-cancel-button
    confirmButtonText="提交"
    @confirm="confirm"
  >
    <div class="text-input-box">
      <van-field
        v-model="apparDesc"
        rows="1"
        autosize
        type="textarea"
        placeholder="请输入"
      />
    </div>
  </van-dialog>
</template>
<script>
export default {
  props: {
    show: {
      type: Object,
      default:() => ({ open: false }),
    },
  },
  data() {
    return {
      apparDesc: '',
    }
  },
  methods: {
    confirm() {
      this.$emit('submit', this.apparDesc)
    },
  },
}
</script>
<style lang="scss" scoped>
.van-dialog {
  width: 285px;
  height: 286px;
  border-radius: 5px;
  .text-input-box {
    padding-top: 2px;
    width: 235px;
    height: 130px;
    border-radius: 4px;
    border: 1px solid #bac2d6;
    margin: 24px 25px 0;
  }
}
::v-deep .van-dialog__header {
  font-size: 14px;
  font-family: PingFangSC-Semibold, PingFang SC;
  font-weight: 600;
  color: #002170;
}
::v-deep .van-dialog__footer {
  margin: 16px 26px;
  button {
    &:first-child {
      .van-button__content {
        width: 110px;
        height: 40px;
        border-radius: 5px;
        border: 1px solid #bac2d6;
        font-size: 14px;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: #136fd1;
      }
    }
    &:last-child {
      padding-left: 12px;
      .van-button__content {
        width: 110px;
        height: 40px;
        background: #2a529f;
        border-radius: 5px;
        font-size: 14px;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: #ffffff;
      }
    }
  }
  [class*="van-hairline"] {
    &::after {
      display: none;
    }
  }
}
::v-deep .van-hairline--top {
  &::after {
    border-top-width: 0;
  }
}
</style>